<template>
  <div>
    <van-form @submit="onSubmit">
      <van-field v-model="username" name="username" label="用户名" placeholder="用户名"
        :rules="[{ required: true, message: '请填写用户名' }]" />
      <van-field v-model="password" type="password" name="password" label="密码" placeholder="密码"
        :rules="[{ required: true, message: '请填写密码' }]" />
      <div style="margin: 16px;">
        <van-button round block type="info" native-type="submit">提交</van-button>
      </div>
    </van-form>
  </div>
</template>

<script>
import axios from 'axios'
import { Notify } from 'vant';
export default {
  data() {
    return {
      username: '',
      password: '',
    };
  },
  methods: {
    async onSubmit(values) {
      try {
        const resp = await axios.post('/api/login', values)
        Notify({ type: 'success', message: '登录成功, 进入我的页面' });
        localStorage.setItem('token', resp.data.data.token)
        this.$router.push('/my')
      } catch {
        Notify({ type: 'danger', message: '账户密码错误！！' });
      }
    },
  },
};

</script>